
<template>
    <div class="human-container">
        <div class="header">
            <el-row>
                <el-col :offset="14" :span="6">
                    <el-input size="mini" v-model="Name" placeholder="请输入项目名称" clearable></el-input> 
                </el-col>
                <el-col :span="4">
                    <el-button size="mini" type="primary" @click="getDataList">查询</el-button>
                    <el-button size="mini" type="success" @click="editDemandEvt">新增</el-button>
                </el-col>
            </el-row>
            
        </div>
        <el-table
            :data="tableData"
            style="width:100%"
            max-height="730px">
            <el-table-column
            fixed
            prop="id"
            label="项目编号"
            width="150">
            </el-table-column>
            <el-table-column
            prop="amount"
            label="投资金额（单位：万）"
            width="150">
            </el-table-column>
            <el-table-column
            prop="level"
            label="项目等级"
            width="120">
            </el-table-column>
            <el-table-column
            prop="name"
            label="项目名称"
            width="120">
            </el-table-column>
            <el-table-column
            prop="schedule"
            label="项目工期"
            width="120">
            </el-table-column>
            <el-table-column
            prop="state"
            label="项目状态"
            width="220">
            </el-table-column>
            <el-table-column
            prop="type"
            label="项目类型"
            width="120">
            </el-table-column>
            <el-table-column
            prop="contact"
            label="申请人"
            width="120">
            </el-table-column>
            <el-table-column
            prop="phone"
            label="联系方式"
            width="120">
            </el-table-column>
            <el-table-column
            fixed="right"
            label="操作"
            width="150">
            <template slot-scope="scope">
                <el-button
                @click.native.prevent="deleteRow(scope.$index, tableData)"
                type="text">
                <span>查看</span>
                </el-button><el-button
                @click.native.prevent="deleteRow(scope.$index, tableData)"
                type="text">
                <span>审批</span>
                </el-button>
            </template>
            </el-table-column>
        </el-table>
        <div class="pages">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="pagenum"
                :page-sizes= "[10, 30, 50, 100]"
                :page-size= "pagesize"
                layout="total, sizes, prev, pager, next, jumper"
                :total= total>
            </el-pagination>
        </div>
    </div>
</template>

<script>
    import ajax from '@/util/Ajax'
    export default {
        data () {
            return {
                tableData : [],
                Name : '' ,
                total : 0,
                pagesize : 10,
                pagenum : 1,
            }
        },
        methods : {
            async getDataList () {
                let path = this.$route.path
                let load = this.$loading();
                let res = await ajax({
                    url : '/demand/list',
                    params : {
                        pageSize : this.pagesize,
                        pageNum : this.pagenum,
                        name : this.Name,
                        dept: path === '/demand/company/approve' ? '总部' 
                            : path === '/demand/dept/approve' ? '科室' : null,
                    }
                    })
                load.close()
                console.log(res)
                if (res.code === 200) {
                    this.tableData = res.data.rows
                    this.total = res.data.total
                }else {
                    this.$message.warning('获取数据失败，请重试')
                }
            },
            editDemandEvt () {
                this.$router.push('/demand/edit')
            },
            handleSizeChange (val) {
                this.pagesize = val
                this.getDataList()
            },
            handleCurrentChange (val) {
                this.pagenum = val
                this.getDataList()
            }
        },
        created () {
            this.getDataList()
        }, 
        watch : {
            '$route.path' : function (n , o) {
               this.getDataList()
            }
        },
    }
</script>

<style lang="less" scoped>
    @import "@/styles/common";
    .header {
        padding-bottom: 10px;
        margin-top: -5px;
        input,
        button {
            margin : 0 8px;
        }
    }
    .pages {
        float: right;
    } 
</style>